<template>
    <div>
        <el-dialog
            width="500"
            class="bg-primarylight p-[3px]"
            :show-close="false"
            draggable
            overflow
            destroy-on-close
            :close-on-click-modal="false"
            header-class="pb-[6px] pt-[3px] pl-[10px]"
            body-class="bg-white rounded-md p-[5px]"
            footer-class="bg-white rounded-b-md p-[3px]"
            v-bind="$attrs"
        >
            <template #header="{ close }">
                <div
                    class="dialog-title flex items-center justify-between font-semibold text-[16px]"
                >
                    <slot name="header"></slot>
                    <span
                        class="icon-[mdi--close-box] text-[22px] cursor-pointer"
                        @click="close"
                    ></span>
                </div>
            </template>
            <template #default>
                <slot></slot>
            </template>
        </el-dialog>
    </div>
</template>

<script setup></script>

<style scoped lang="scss"></style>
